[fix] 카드 목록에 기본 이미지가 안불러 와지는 문제 수정#877
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Warning
|
| 응집군 / 파일(들) | 변경 요약 |
|---|---|
ClubCard 컴포넌트 포맷팅 frontend/src/pages/ClubDetailPage/components/ClubCard/ClubCard.tsx |
onClick prop의 closing tag가 별도 줄로 이동. 이벤트 핸들러 기능 및 네비게이션 흐름에 변화 없음. |
ClubLogo 컴포넌트 CSS 업데이트 frontend/src/components/ClubLogo/ClubLogo.tsx |
CSS background-image 규칙에서 URL을 큰따옴표로 감싸도록 변경 (url($imageSrc) → url("$imageSrc")). $imageSrc가 없을 때는 'none' 그대로 유지. |
Estimated code review effort
🎯 1 (Trivial) | ⏱️ ~3 minutes
Possibly related PRs
- [feature] 메인페이지 새로운 카드 디자인을 적용한다 #773: ClubLogo.tsx의 로고 크기 프리셋 및 breakpoint 업데이트와 관련된 PR로, 동일 파일에서 스타일 관련 수정이 있음.
Suggested reviewers
- seongwon030
- seongje973
Pre-merge checks and finishing touches
✅ Passed checks (3 passed)
| Check name | Status | Explanation |
|---|---|---|
| Description Check | ✅ Passed | Check skipped - CodeRabbit’s high-level summary is enabled. |
| Title check | ✅ Passed | PR 제목이 변경 사항의 주요 내용을 명확하게 요약하고 있습니다. 제목은 카드 목록에서 기본 이미지가 로드되지 않는 문제를 수정한다는 실제 변경 사항과 정확히 일치합니다. |
| Docstring Coverage | ✅ Passed | No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. |
✨ Finishing touches
- 📝 Generate docstrings
🧪 Generate unit tests (beta)
- Create PR with unit tests
- Post copyable unit tests in a comment
- Commit unit tests in branch
fix/default-profile-image-missing
📜 Recent review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
Disabled knowledge base sources:
- Jira integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (2)
frontend/src/components/ClubLogo/ClubLogo.tsx(1 hunks)frontend/src/pages/ClubDetailPage/components/ClubCard/ClubCard.tsx(2 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- frontend/src/pages/ClubDetailPage/components/ClubCard/ClubCard.tsx
🧰 Additional context used
🧠 Learnings (1)
📓 Common learnings
Learnt from: seongwon030
Repo: Moadong/moadong PR: 195
File: frontend/src/pages/AdminPage/AdminPage.tsx:7-7
Timestamp: 2025-03-19T05:18:07.818Z
Learning: AdminPage.tsx에서 현재 하드코딩된 클럽 ID('67d2e3b9b15c136c6acbf20b')는 로그인 기능 구현 후 동적으로 가져오는 방식으로 수정될 예정입니다.
Learnt from: seongwon030
Repo: Moadong/moadong PR: 548
File: frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx:17-57
Timestamp: 2025-07-19T05:05:10.196Z
Learning: ClubDetailPage.tsx에서 notJoinedClubNames 배열의 하드코딩은 의도적인 설계 결정입니다. 개발자가 명시적으로 하드코딩을 선택했으므로 이에 대한 리팩토링 제안을 하지 않아야 합니다.
🔇 Additional comments (1)
frontend/src/components/ClubLogo/ClubLogo.tsx (1)
32-32: ClubLogo.tsx의 수정은 올바르게 적용되었으나, 유사한 패턴이 다른 파일에서도 발견되었습니다.스크립트 결과에 따르면
frontend/src/pages/AdminPage/tabs/ApplicantsTab/ApplicantDetailPage/ApplicantDetailPage.styles.ts의 41번 줄과 68번 줄에서 유사한 패턴이 발견되었습니다:background-image: url(${DropdownArrow}); // 인용부호 없음ClubLogo.tsx는 이미 인용부호로 감싸진 상태이지만(
url("${$imageSrc}")), ApplicantDetailPage의 패턴은 여전히 인용부호가 없습니다. 이 파일의DropdownArrow가 base64 데이터 URL이거나 특수문자를 포함하는 경우 동일한 Vite 마이그레이션 이슈가 발생할 수 있습니다.권장사항:
- ApplicantDetailPage.styles.ts 41번 줄과 68번 줄도 동일하게 double quote로 감싸는 수정 필요
- 일관성 있는 접근: 모든 동적 URL은 인용부호로 감싸기
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.
Comment @coderabbitai help to get the list of available commands and usage tips.
seongwon030
left a comment
seongwon030
left a comment
There was a problem hiding this comment.
ClubLogo 컴포넌트에
background-image: ${$imageSrc ? `url(${$imageSrc})` : 'none'};
부분을 이런식으로 바꿔서 스타일 내부에서 처리해도 괜찮지 않을까요?
/* 수정된 부분: url("...") 큰따옴표 추가 */
background-image: ${$imageSrc ? `url("${$imageSrc}")` : 'none'};
2 participants
vite 환경으로 바꾸면서
기존 background-image: url(base:64); 문자에 %24로 인코딩되던 작은 따옴표가 인코딩되지 않고 들어가서 invalid property로 인식됨
따라서 url 밖에 쌍따옴표를 감싸주면 해결됩니다
Summary by CodeRabbit
릴리스 노트
✏️ Tip: You can customize this high-level summary in your review settings.